 {template 'page_header'}
	<script type="text/javascript" src="../addons/scene_cube/style/src/spuotlet_map.js?v=2014-05-21"></script>
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=359042E5AC9ced07c553ebe2042aad73"></script>
    <div id="main">
        <div class="container-fluid">
            <div class="row-fluid">
                <div class="span12">

                    <div class="box">
                        <div class="box-title">
                            <div class="span12">
                                <h3><i class="icon-edit"></i>{if $id}修改{else}新增{/if}画面 <small>{$app['title']}</small></h3>
                            </div>
                        </div>
						
                        <form id="page_form" action="" method="post" class="form-horizontal form-validate">
				
                              <div class="box-content">
								
                                <div class="control-group">
                                    <label for="listorder" class="control-label">排序：</label>
                                    <div class="controls">
                                        <input type="text" name="listorder" id="listorder" class="input-medium" data-rule-required="true" data-rule-maxlength="50" value="{$item['listorder']}">
                                        <span class="maroon">*</span>
                                        <span class="help-inline">越大越靠前</span>
                                    </div>
                                </div>
                                <div class="js_scene_picture">
                                    <div class="control-group">
                                        <label for="m_type" class="control-label">画面样式：</label>
                                        <div class="controls">
										
                                            <select class="inpit-medium js_scene_style_select" name="m_type" data-rule-required="true">
                                                <option value="1" data-type="first" {if $item['m_type']==1}selected{/if}>场景1(单独图片)</option>
                                                <option value="2" data-type="second" {if $item['m_type']==2}selected{/if}>场景2(招聘信息)</option>
                                                <!--option value="3" data-type="third" {if $item['m_type']==3}selected{/if}>场景3(双图片)</option-->
												<!--option value="4" data-type="fourth" {if $item['m_type']==4}selected{/if}>场景4(上下图)</option>
												<!--option value="5" data-type="fifth" {if $item['m_type']==5}selected{/if}>场景5(优酷视频)</option-->
                                                <option value="6" data-type="sixth" {if $item['m_type']==6}selected{/if}>场景6(分享)</option>
                                                <option value="7" data-type="seventh" {if $item['m_type']==7}selected{/if}>场景7(链接)</option>
                                                <option value="8" data-type="eighth" {if $item['m_type']==8}selected{/if}>场景8(电话)</option>
                                                <!--option value="9" data-type="ninth" {if $item['m_type']==9}selected{/if}>场景9(信息)</option>
                                                <option value="10" data-type="tenth" {if $item['m_type']==10}selected{/if}>带拨号图片式</option-->
                                                
											</select>
                                        </div>
                                    </div>
									<div class="control-group alert js_scene_style js_first hide">
										场景1：单独一张图片。(具体参考实例)
									</div>
									
									<div class="control-group alert alert-success js_scene_style js_second hide">
										场景2：招聘表单提交(具体参考实例)
									</div>
									
									<div class="control-group alert alert-info js_scene_style js_third hide">
										场景3：小图展示在下方，点击出现一个全屏大图，可以关闭。(具体参考实例)
									</div>
									<div class="control-group alert alert-error js_scene_style js_fourth hide">
										场景4：小图展示在下方，图片在右上展示，如果超宽图片，会左右晃动。(具体参考实例)
									</div>
									<div class="control-group alert js_scene_style js_fifth hide">
										场景5：(具体参考实例)
									</div>
									<div class="control-group alert alert-success js_scene_style js_sixth hide">
										场景6：(具体参考实例)
									</div>
									<div class="control-group alert alert-info js_scene_style js_seventh hide">
										场景7：(具体参考实例)
									</div>
									<div class="control-group alert alert-error js_scene_style js_eighth hide">
										场景8：(具体参考实例)
									</div>
                                    <div class="control-group">
                                        <label for="" class="control-label">画面内容：</label>
                                        <div class="controls">
                                            <!--纯图开始-->
                                            <div>
                                                <div id="firstimg_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('thumb', $item['thumb'])}
                                                </div>
                                                <div class="help-inline">（建议尺寸:宽640像素,高960像素或等比图片）</div>
                                            </div>
                                            <!--纯图结束-->
                                        </div>
                                    </div>
									
									 
									<div class="control-group js_scene_style js_second hide">									
										<div class="control-group">
											<label class="control-label" for="str1">预约字段1重定义</label>
											<div class="controls">
												<input type="text" id="str1" class="input-large" name="second[str1]" value="{$data['str1']}"  placeholder="姓名" />
												<span class="maroon">*</span><span class="help-inline">(为空,不显示)</span>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="str2">预约字段2重定义</label>
											<div class="controls">
												<input type="text" id="str2" class="input-large" name="second[str2]"   value="{$data['str2']}"  placeholder="电话" />
												<span class="maroon">*</span><span class="help-inline">(为空,不显示)</span>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="str3">预约字段3重定义</label>
											<div class="controls">
												<input type="text" id="str3" class="input-large" name="second[str3]"  value="{$data['str3']}"  placeholder="岗位" />
												<span class="maroon">*</span><span class="help-inline">(为空,不显示)</span>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="btxt">按钮文字</label>
											<div class="controls">
												<input type="text" id="btxt" class="input-large" name="second[btxt]"  value="{$data['btxt']}"  placeholder="按钮文字" />
												<span class="maroon">*</span><span class="help-inline">(按钮文字)</span>
											</div>
										</div>
										 
										
										 
									</div>
 									<div class="control-group js_scene_style js_third hide">
										<div class="control-group">
											<label for="" class="control-label">图标小图：</label>
											<div class="margin-top10 controls">
												<div id="video_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('third[pic1]', $data['pic1'])}
                                                </div>
                                                <div class="help-inline">（以顶部对齐,建议尺寸:宽640像素,高300像素或等比图片，PNG格式,）</div> 
											</div>
										</div>
										<div class="control-group">
											<label for="" class="control-label">全屏大图：</label>
											<div class="margin-top10 controls">
												<div id="video_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('third[pic2]', $data['pic2'])}
                                                </div>
                                                <div class="help-inline">（以右下为对齐，PNG格式,可为空）</div> 
											</div>
										</div>
									</div>
									<div class="control-group js_scene_style js_fourth hide">									
										<div class="control-group">
											<label for="" class="control-label">下方文字：</label>
											<div class="margin-top10 controls">
												<div id="video_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('fourth[pic1]', $data['pic1'])}
                                                </div>
                                                <div class="help-inline">（以底部对齐,PNG格式,）</div> 
											</div>
										</div>
										<div class="control-group">
											<label for="" class="control-label">上方图片：</label>
											<div class="margin-top10 controls">
												<div id="video_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('fourth[pic2]', $data['pic2'])}
                                                </div>
                                                <div class="help-inline">（如果超宽图片，会左右晃动,建议尺寸:宽640像素,高1008像素或等比图片）</div> 
											</div>
										</div>
									</div>									
									<div class="control-group js_scene_style js_fifth hide">
										<div class="control-group">
											<label class="control-label" for="wxurl">优酷视频</label>
											<div class="controls">
												<input type="text" id="wxurl" class="input-xxlarge" name="fifth[url]" value="{$data['wxurl']}"/>
												<span class="maroon">*</span><span class="help-block">(优酷播放地址,例如：http://v.youku.com/v_show/id_XNzg0Njk0MDUy.html)</span>
											</div>
										</div>
									</div>
									<div class="control-group js_scene_style js_sixth hide">
										<div class="control-group">
											<label for="" class="control-label">按钮小图：</label>
											<div class="margin-top10 controls">
												<div id="video_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('sixth[pic1]', $data['pic1'])}
                                                </div>
                                                <div class="help-inline">（以顶部对齐,建议尺寸:宽580像素,高80像素或等比图片，PNG格式,）</div>
											</div>
										</div>
										<div class="control-group">
											<label for="" class="control-label">分享大图：</label>
											<div class="margin-top10 controls">
												<div id="video_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('sixth[pic2]', $data['pic2'])}
                                                </div>
                                                <div class="help-inline">（以右下为对齐，PNG格式,可为空）</div> 
											</div>
										</div>
									</div>							
									<div class="control-group js_scene_style js_seventh hide">
										<div class="control-group">
											<label for="" class="control-label">按钮小图：</label>
											<div class="margin-top10 controls">
												<div id="video_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('seventh[pic1]', $data['pic1'])}
                                                </div>
                                                <div class="help-inline">（以顶部对齐,建议尺寸:宽580像素,高80像素或等比图片，PNG格式,）</div>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="url7">外部链接</label>
											<div class="controls">
												<input type="text" id="url7" class="input-xxlarge" name="seventh[url]" value="{$data['url']}" data-rule-required="true"  data-rule-url="true"/>
												<span class="maroon">*</span><span class="help-block">(外部链接地址)</span>
											</div>
										</div>
									</div>							
									<div class="control-group js_scene_style js_eighth hide">
										<div class="control-group">
											<label for="" class="control-label">按钮小图：</label>
											<div class="margin-top10 controls">
												<div id="video_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('eighth[pic1]', $data['pic1'])}
                                                </div>
                                                <div class="help-inline">（以顶部对齐,建议尺寸:宽580像素,高80像素或等比图片，PNG格式,）</div>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="url8">电话号码</label>
											<div class="controls">
												<input type="text" id="url8" class="input-large" name="eighth[tel]" value="{$data['tel']}" data-rule-required="true"  data-rule-phone="true"/>
												<span class="maroon">*</span><span class="help-inline">(电话号码)</span>
											</div>
										</div>
									</div>		
									<div class="control-group js_scene_style js_ninth hide">
										<div class="control-group">
											<label for="" class="control-label">电话：</label>
											<div class="controls">
												<input type="text" class="input-xlarge" name="ninth[tel]" value="{$data['tel']}" placeholder="请输入电话号码"  data-rule-phone="true"/>
												<span class="help-block">请填写真实的电话号码</span>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="mail">邮件</label>
											<div class="controls">
												<input type="text" id="mail" class="input-large" name="ninth[email]" data-rule-email="true" value="{$data['email']}"/>
												<span class="maroon">*</span><span class="help-inline">(为空,不显示)</span>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="wxurl">微信链接</label>
											<div class="controls">
												<input type="text" id="wxurl" class="input-xxlarge" name="ninth[wxurl]" value="{$data['wxurl']}"/>
												<span class="maroon">*</span><span class="help-inline">(微信链接地址)</span>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="weixin">微信</label>
											<div class="controls">
												<input type="text" id="weixin" class="input-large" name="ninth[weixin]" value="{$data['weixin']}"/>
												<span class="maroon">*</span><span class="help-inline">(为空,不显示)</span>
											</div>
										</div>
                                    </div>
                                </div>
							 
									<!--分享开始-->
									
									
									
									 
 									<div class="control-group js_scene_style js_map hide">
										<div class="control-group">
											<label class="control-label" for="tel">电话号码</label>
											<div class="controls">
												<input type="text" id="tel" class="input-large" name="map[tel]" data-rule-phone="true" value="{$data['tel']}"/>
												<span class="maroon">*</span><span class="help-inline">(为空,不显示)</span>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="mail">邮件</label>
											<div class="controls">
												<input type="text" id="mail" class="input-large" name="map[email]" data-rule-email="true" value="{$data['email']}"/>
												<span class="maroon">*</span><span class="help-inline">(为空,不显示)</span>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="str1">预约字段重定义1</label>
											<div class="controls">
												<input type="text" id="str1" class="input-large" name="map[str1]" data-rule-email="true" value="{$data['str1']}"  placeholder="姓名" />
												<span class="maroon">*</span><span class="help-inline">(为空,不显示)</span>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="str2">预约字段重定义2</label>
											<div class="controls">
												<input type="text" id="str2" class="input-large" name="map[str2]" data-rule-email="true" value="{$data['str2']}"  placeholder="电话" />
												<span class="maroon">*</span><span class="help-inline">(为空,不显示)</span>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="str3">预约字段重定义3</label>
											<div class="controls">
												<input type="text" id="str3" class="input-large" name="map[email]" data-rule-email="true" value="{$data['str3']}"  placeholder="地址" />
												<span class="maroon">*</span><span class="help-inline">(为空,不显示)</span>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="wxurl">微信链接</label>
											<div class="controls">
												<input type="text" id="wxurl" class="input-xxlarge" name="map[wxurl]" value="{$data['wxurl']}"/>
												<span class="maroon">*</span><span class="help-inline">(微信链接地址)</span>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="weixin">微信</label>
											<div class="controls">
												<input type="text" id="weixin" class="input-large" name="map[weixin]" value="{$data['weixin']}"/>
												<span class="maroon">*</span><span class="help-inline">(为空,不显示)</span>
											</div>
										</div>
										<div class="control-group">
											<label for="" class="control-label">视频背景：</label>
											<div class="margin-top10 controls">
												<div id="map_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('map[mthumb]', $data['mthumb'])}
                                                </div>
                                                <div class="help-inline">（建议尺寸:）</div> 
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="sname">名称</label>
											<div class="controls">
												<input type="text" id="sname" class="input-large" name="map[sname]" value="{$data['sname']}"/>
												<span class="maroon">*</span><span class="help-inline">(导航显示名称)</span>
											</div>
										</div>
										<div class="control-group">
											<label class="control-label" for="suggestId">经纬度</label>
											<div class="controls">
												<div class="input-append">
													<input type="text" id="suggestId" class="input-xlarge" name="map[place]" data-rule-required="true"  value="{$data['place']}"/>
													<button class="btn" type="button" id="positioning">搜索</button>
												</div>

												<span class="maroon">注意：这个只是模糊定位，准确位置请地图上标注!</span>
												<div id="l-map">
													<i class="icon-spinner icon-spin icon-large"></i>地图加载中...
												</div>
												<div id="r-result">
													<input type="hidden" id="lng" name="map[lng]" value="{$data['lng']}" /><input type="hidden" id="lat" name="map[lat]" value="{$data['lat']}"  />
												</div>
											</div>
										</div>
									</div>
                            <div class="control-group js_scene_style js_pics hide">
								<label class="control-label">多图展示：</label>
								<div class="controls">
									<div class="span12"><a href="javascript:void(0)" class="btn" id="add_menu"><i class="icon-plus"></i>添加图片</a></div>
									<table class="table table-bordered table-hover dataTable">

										<thead>
											<tr>
												<th>缩略图</th>
												<th>图片地址</th>
 												<th class="norightborder">操作</th>
											</tr>
										</thead>
										<tbody id="listTable">
											{if empty($data['thumbs'])}
												<tr class="copy_rows">
													<td>
													<div id="map_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('pics[nails][]', $data['mthumb'])}
                                                </div>
                                                <div class="help-inline">（建议尺寸:宽250像素,高350像素或等比图片）</div>
														</td>												
													<td>
													<div id="map_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('pics[thumbs][]', $data['mthumb'])}
                                                </div>
                                                <div class="help-inline">（建议尺寸:宽400像素,高700像素或等比图片）</div>
														</td>
													<td><a href="javascript:;" class="del">删除</a></td>
												</tr>
											{else}	
												{loop $data['thumbs'] $key $row} 
												<tr class="copy_rows">
												<td>
													{if isset($data['nails'][$key])}
													<div id="map_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('pics[nails][]', $data['nails'][$key])}
                                                </div>
                                                <div class="help-inline">（建议尺寸:宽400像素,高700像素或等比图片）</div>
													{else}
													<div id="map_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('pics[nails][]', $data['nails'][$key])}
                                                </div>
                                                <div class="help-inline">（建议尺寸:宽250像素,高350像素或等比图片）</div>
												
													{/if}
												</td>
												<td>
													<div id="map_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('pics[thumbs][]', $row)}
                                                </div>
                                                <div class="help-inline">（建议尺寸:）</div>
												</td>
												<td><a href="javascript:;" class="del">删除</a></td>
												</tr>
												{/loop}
											{/if}
										</tbody>
									</table>
									<span class="help-block">大图小图必须配对上传，否则会出错</span>
								</div>
							</div>
							<div class="control-group js_scene_style js_intro hide">
								<label class="control-label">多图展示：</label>
								<div class="controls">
									<div class="span12"><a href="javascript:void(0)" class="btn" id="add_menu2"><i class="icon-plus"></i>添加图片</a></div>
									<table class="table table-bordered table-hover dataTable">

										<thead>
											<tr>
												<th>标题</th>
												<th>图片地址</th>
 												<th>文字介绍</th>
 												<th class="norightborder">操作</th>
											</tr>
										</thead>
										<tbody id="listTable2">
											{if empty($data['thumbs'])}
												<tr class="copy_rows2">
													<td>
														<input type="text" name="intro[title][]"  value="" class="input-small">
													</td>												
													<td>
													<div id="map_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('intro[thumbs][]', '')}
                                                </div>
                                                <div class="help-inline">（建议尺寸:宽400像素,高700像素或等比图片）</div>
														</td>
													<td>
													<textarea class="input-xlarge ui-wizard-content ui-helper-reset ui-state-default" name="intro[content][]" data-rule-required="true"></textarea>
													</td>
													<td><a href="javascript:;" class="del">删除</a></td>
												</tr>
											{else}	
												{loop $data['thumbs'] $key $row} 
												<tr class="copy_rows2">
												<td>
													<input type="text" name="intro[title][]"  value="{$data['title'][$key]}" class="input-small">
												</td>
												<td>
													<div id="map_image_uploads" style="width:330px;">
                                                    {php echo tpl_form_field_image('intro[thumbs][]', $row)}
                                                </div>
                                                <div class="help-inline">（建议尺寸:）</div>
												</td>
												<td>
													<textarea class="input-xlarge ui-wizard-content ui-helper-reset ui-state-default"  name="intro[content][]" data-rule-required="true">{$data['content'][$key]}</textarea>
												</td>
												<td><a href="javascript:;" class="del">删除</a></td>
												</tr>
												{/loop}
											{/if}
										</tbody>
									</table>
									<span class="help-block">大图小图必须配对上传，否则会出错</span>
								</div>
							</div>
									
                              
                                <div class="form-actions" style="margin-left:170px;">
                                    <button type="submit" class="btn btn-primary">保存</button>
                                    <button type="button" class="btn" onclick="window.history.go(-1)">取消</button>
                                </div>
                            </div>
                        </form>


                    </div>
                </div>
            </div>

        </div>
    </div>
    <script type="text/javascript">      
        $(function () {
            $(".js_scene_picture").each(function(){
                var type=$(this).find(".js_scene_style_select option:selected").data("type");
                $(this).find(".js_scene_style").addClass('hide');
                $(this).find(".js_"+type).removeClass('hide');
				if(type=='map'){
					{if !empty($data['lat'])&&!empty($data['lng'])}
					   var op = { 
							lat: {$data['lat']},
							lng: {$data['lng']},
							adr: "{$data['place']}"
						}
						baidu_map(op);
					{else}
						baidu_map();
					{/if}
				}
            });
            $(document).on("change",".js_scene_style_select",function(){
                var $p=$(this).parents(".js_scene_picture"),type=$(this).find("option:selected").data("type");
                $p.find(".js_scene_style").addClass('hide');
                $p.find(".js_"+type).removeClass('hide');
				if(type=='map'){
				   {if !empty($data['lat'])&&!empty($data['lng'])}
					   var op = { 
							lat: {$data['lat']},
							lng: {$data['lng']},
							adr: "{$data['place']}"
						}
						baidu_map(op);
					{else}
						baidu_map();
					{/if}
				}
            });
			
        });
        /*
		 KindEditor.ready(function(K){
			var editor = KindEditor.editorObj || K.editor({
				themeType: 'simple',
				allowFileManager: true,
				uploadJson : "./index.php?act=attachment&do=upload",
				fileManagerJson : "./index.php?act=attachment&do=manager",
			});

			$('.select_img').click(function(e){
				editor.loadPlugin('image', function(){
					editor.plugin.imageDialog({
						imageUrl: $(e.target).parent().prev().val(),
						clickFn: function(url, title, width, height, border, align){
							var val = url;
							if(url.toLowerCase().indexOf("http://") == -1 && url.toLowerCase().indexOf("https://") == -1) {
								var filename = /images(.*)/.exec(url);
								if(filename && filename[0]) {
									val = filename[0];
								}
							}
							$(e.target).parent().prev().val(val);
							
							if('image-single' == $(e.target).parent().prev().prev().attr('upload')){
								$(e.target).parent().prev().prev().attr('src', url);
								$(e.target).parent().prev().prev().attr('alt', url)
							}

							editor.hideDialog();
						}
					});
				});
			});		
		});
		*/
		window.document.onkeydown = function(e) {
			if ('BODY' == event.target.tagName.toUpperCase()) {
				var e=e || event;
　 				var currKey=e.keyCode || e.which || e.charCode;
				if (8 == currKey) {
					return false;
				}
			}
		};
		//页面事件监听
		$(document).ready(function(){
			//新增门店实景
			$("#add_menu").click(function(){
				$('.copy_rows:first').clone(true).appendTo('#listTable').find('input[type=text]').val('');
				$('.copy_rows:last').find('img').attr({src:'',alt:'',title:''});
				//$('.copy_rows:last').find('script').remove();
			});
			
			//删除门店实景
			$("#listTable .del").click(function () {
					var removeObj = $(this).parent('td').parent('tr');
					var className = removeObj.attr('class');
					if($("." + className).length <= 1){
						removeObj.find('img').attr("src","");
						return removeObj.find('input[type=text],input[type=hidden]').val('');
						
					}
					return removeObj.remove();
				
			});
			//新增门店实景
			$("#add_menu2").click(function(){
				$('.copy_rows2:first').clone(true).appendTo('#listTable2').find('input[type=text]').val('');
				$('.copy_rows2:last').find('img').attr({src:'',alt:'',title:''});
				//$('.copy_rows:last').find('script').remove();
			});
			
			//删除门店实景
			$("#listTable2 .del").click(function () {
					var removeObj = $(this).parent('td').parent('tr');
					var className = removeObj.attr('class');
					if($("." + className).length <= 1){
						removeObj.find('img').attr("src","");
						return removeObj.find('input[type=text],input[type=hidden]').val('');
						
					}
					return removeObj.remove();
				
			});
		});
	

	</script>
 {template 'common/footer'}